{% extends 'base.html' %}

{% load staticfiles %}

{% block title %}课程评论{% endblock %}
{% block crumbs %}
    <!--crumbs start-->
    <section>
        <div class="wp">
            <div class="crumbs">
                <ul>
                    <li><a href="{% url 'index' %}">首页</a>></li>
                    <li><a href="{% url 'courses:list' %}">公开课程</a>></li>
                    <li><a href="{% url 'courses:detail' course.id %}">课程详情</a>></li>
                    <li>课程评论</li>
                </ul>
            </div>
        </div>
    </section>
    </section>
    <!--crumbs end-->
{% endblock %}
{% block body %}
    <div id="main">
    <div class="course-infos">
        <div class="w pr">
            <div style="height: 15px" class="path">
            </div>
            <div class="hd">
                <h2 class="l">&ensp;{{ course.name }}</h2>
            </div>
            <div class="statics clearfix">
                <div class="static-item ">
                    <span class="meta-value"><strong>{{ course.get_degree_display }}</strong></span>
                    <span class="meta">难度</span>
                    <em></em>
                </div>
                <div class="static-item static-time">
                    <span class="meta-value">{{ course.learn_time }}</span>
                    <span class="meta">时长</span>
                    <em></em>
                </div>
                <div class="static-item">
                    <span class="meta-value"><strong>{{ course.students }}</strong></span>
                    <span class="meta">学习人数</span>
                    <em></em>
                </div>
            </div>
        </div>
    </div>
    <div class="course-info-main clearfix w has-progress">

        <div class="info-bar clearfix">
            <div class="content-wrap clearfix">
                <div class="content">
                    <div class="mod-tab-menu">
                        <ul class="course-menu clearfix">
                            <li><a id="commentOn" class=""
                                   href="{% url 'courses:video' course.id %}"><span>章节</span></a></li>
                            <li><a class="ui-tabs-active active" id="learnOn"><span>评论</span></a></li>
                        </ul>
                    </div>

                    <!--发布评论-->
                    <!--PC版-->
                    <div id="SOHUCS"></div>
                    <script charset="utf-8" type="text/javascript"
                            src="https://changyan.sohu.com/upload/changyan.js"></script>
                    <script type="text/javascript">
                        window.changyan.api.config({
                            appid: 'cyuAfc9He',
                            conf: 'prod_dcba6195e76d2253a5c8161a9cf4e8eb'
                        });
                    </script>
                    {#                    <div id="js-pub-container" class="issques clearfix js-form">#}
                    {#                        <div class="wgt-ipt-wrap pub-editor-wrap " id="js-pl-input-fake">#}
                    {#                            <textarea id="js-pl-textarea" class="" placeholder="扯淡、吐槽、表扬、鼓励……想说啥就说啥！" ></textarea>#}
                    {#                        </div>#}
                    {#                        <input type="button" id="js-pl-submit" class="pub-btn" data-cid="452" value="发表评论">#}
                    {#                        <p class="global-errortip js-global-error"></p>#}
                    {#                    </div>#}
                    {#                    <div id="course_note">#}
                    {#                        <ul class="mod-post" id="comment-list">#}
                    {##}
                    {#                            {% for comment in comments %}#}
                    {#                            <li class="post-row">#}
                    {#                                <div class="media">#}
                    {#                                    <span target="_blank"><img src='{{ MEDIA_URL }}{{ comment.user.image }}' width='40' height='40' /></span>#}
                    {#                                </div>#}
                    {#                                <div class="bd">#}
                    {#                                    <div class="tit">#}
                    {#                                        <span target="_blank" class="color-blue">{{ comment.user.nick_name }}</span>#}
                    {#                                    </div>#}
                    {#                                    <p class="cnt">{{ comment.comments }}</p>#}
                    {#                                    <div class="footer clearfix">#}
                    {#                                        <span title="创建时间" class="l timeago">时间：{{ comment.add_time }}</span>#}
                    {#                                    </div>#}
                    {#                                </div>#}
                    {#                            </li>#}
                    {#                            {% endfor %}#}
                    {##}
                    {#                        </ul>#}
                    {#                    </div>#}
                    {##}
                    {#                </div>#}
{#                    资料下载#}
                    <div class="aside r">
                        <div class="bd">

                            <div class="box mb40">
                                <h4>资料下载</h4>

                                <ul class="downlist">
                                    {% for resource in resources %}
                                        <li>
                                            <span><i
                                                    class="aui-iconfont aui-icon-file"></i>&nbsp;&nbsp;{{ resource.name }}</span>
                                            <a href="{{ MEDIA_URL }}{{ resource.download }}" class="downcode"
                                               target="_blank" download="" data-id="274" title="">下载</a>
                                        </li>
                                    {% endfor %}
                                </ul>
                            </div>
                            {#教师提示#}
                            <div class="box mb40">
                                <h4>教师提示</h4>
                                <div class="teacher-info">
                                    <a href="{% url 'org:teacher_detail' course.teacher.id %}" target="_blank">
                                        <img src='{{ MEDIA_URL }}{{ course.teacher.image }}' width='80' height='80'/>
                                    </a>
                                    <span class="tit">
                          <a href="{% url 'org:teacher_detail' course.teacher.id %}"
                             target="_blank">{{ course.teacher.name }}</a>
                        </span>
                                    <span class="job">{{ course.teacher.work_position }}</span>
                                </div>
                                <div class="course-info-tip">
                                    <dl class="first">
                                        <dt>课程须知</dt>
                                        <dd class="autowrap">{{ course.before_know }}</dd>
                                    </dl>
                                    <dl>
                                        <dt>老师告诉你能学到什么？</dt>
                                        <dd class="autowrap">{{ course.teacher_tell }}</dd>
                                    </dl>
                                </div>
                            </div>


                            <div class="cp-other-learned  js-comp-tabs">
                                <div class="cp-header clearfix">
                                    <h2 class="cp-tit l">该课的同学还学过</h2>
                                </div>
                                <div class="cp-body">
                                    <div class="cp-tab-pannel js-comp-tab-pannel" data-pannel="course"
                                         style="display: block">
                                        <!-- img 200 x 112 -->
                                        <ul class="other-list">
                                            {% for course_list in course_lists %}
                                                <li class="curr">
                                                    <a href="course-detail.html" target="_blank">
                                                        <img src="{{ MEDIA_URL }}{{ course_list.image }}"
                                                             alt="{{ course_list.name }}">
                                                        <span class="name autowrap">{{ course_list.name }}</span>
                                                    </a>
                                                </li>
                                            {% endfor %}
                                        </ul>
                                    </div>
                                    <div class="cp-tab-pannel js-comp-tab-pannel" data-pannel="plan">
                                        <ul class="other-list">
                                            <li class="curr">
                                                <a href="/course/programdetail/pid/31?src=sug" target="_blank">
                                                    <img src="http://img.mukewang.com/56551e6700018b0c09600720-240-135.jpg"
                                                         alt="Java工程师">
                                                    <span class="name autowrap">Java工程师</span>
                                                </a>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
                <div class="clear"></div>

            </div>

        </div>
    </div>
{% endblock %}

{% block custom_js %}
    <script type="text/javascript">
        //添加评论
        $('#js-pl-submit').on('click', function () {
            var comments = $("#js-pl-textarea").val()
            if (comments == "") {
                alert("评论不能为空")
                return
            }
            $.ajax({
                cache: false,
                type: "POST",
                url: "/course/add_comment/",
                data: {'course_id': 10, 'comments': comments},
                async: true,
                beforeSend: function (xhr, settings) {
                    xhr.setRequestHeader("X-CSRFToken", "5I2SlleZJOMUX9QbwYLUIAOshdrdpRcy");
                },
                success: function (data) {
                    if (data.status == 'fail') {
                        if (data.msg == '用户未登录') {
                            window.location.href = "{% url 'users:login' %}";
                        } else {
                            alert(data.msg)
                        }

                    } else if (data.status == 'success') {
                        window.location.reload();//刷新当前页面.
                    }
                },
            });
        });

    </script>
{% endblock %}

